<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <script src="/scripts/jquery.js"></script>
    <link href="/styles/common.css" rel="stylesheet" type="text/css"/>
  </head>
  <style>
  	.outdiv{
  		padding:10px 0 0 20px;
  	}
  	.listone{
  		float:left;
  		width:1100px;
  		border:1px solid #CCCCCC;
  		margin: 3px 0 0 3px;
  		
  	}
  	.one ,.two_three{
  		margin:4px 0 0 4px;
  	}
  	.one{
  		padding-top:5px;
  		width:1100px;
  		float:left;
  		height:25px;
  		border-bottom:1px solid #CCCCCC;
  	}
  	.one font{
  		display:block;
  		float:left;
  	}
  	.two{
  		float:left ;
  		padding-top:5px;
  		height:25px;
  		width:600px;
  		border:1px dashed #DDDDDD;
  	}
  	.three {
  		height:60px;
  		width:1100px;
  		float:left;
  		padding:10px 0 0 0;
  	}
  	.three div{
  		float:left;
  		width:250px;
  	}
  	.create_but{
  		padding:10px 0 0 0 ;
  		
  	}
  	.create_but input{
  		margin:0 0 0 400px;
		float: left;
  	}
  </style>
  <body>
    <div class="outdiv">
    		<div class="role_name">
    			<font >角色名:</font>
    			<input type="text" id="role_name" value="${role.roleName}" />
    			<input type="hidden" id="role_id" value="${role.id}" />    			

    		</div>
			<c:forEach var="bars" items="${barList}">
				<div class="listone">
					<div class="one">
						<c:forEach var="_n" items="${bars}" end="0">
							<font><c:out value="${_n.tnName}" /></font>
							<input type="checkbox" value="${_n.value}" />
						</c:forEach>
					</div>
					
						<c:forEach var="_a_b" items="${bars}" begin="1" >
							<div class="two_three">
								<c:forEach var="_a" items="${_a_b}" end="0">
									<div class="two"><font><c:out value="${_a.mname}" /></font><input type="checkbox" value="${_a.value}"/></div>
								</c:forEach>
								<div class="three">
					 				<c:forEach var="_b" items="${_a_b}" begin="1">
					 					<div><font><c:out value="${_b.mbname}" /></font><input type="checkbox" value="${_b.value}"/></div>
					 				</c:forEach>
								</div>
							</div>
						</c:forEach>
				</div>
			</c:forEach>
			<div class="create_but">
				<input type="button" value="创建" id="sub" />
			</div>
    </div>
  </body>
</html>
<script>
	$(document).ready(function(){
		if($("#role_id").val() != 0){
			$("#sub").remove();
			selectedcheboxs();
			$("input[type='checkbox']").change(function(){
				if($(this).attr("checked")){
					selectcheckbox($(this));
				}else{
					canceledckeckbox($(this));
				}
			});
		}
		$(".listone>.two_three>.two>input").change(function(){
			if($("#role_id").val() == 0)
				selectOne($(this).parent());
		});
		$(".listone>.two_three>.three>div").children("input").change(function(){
			if($("#role_id").val() == 0)
				selectTwo($(this));
		});
		$(".listone>.one").children("input[type='checkbox']").change(function(){
			if($("#role_id").val() == 0){
				if(!$(this).attr("checked")){
					$(this).parent().parent().find("input[type='checkbox']").each(function(){
						if($(this).attr("checked")){
							$(this).attr("checked",false);
						}
					});
				}
			}
		});
		$("#sub").click(function(){
			ajaxcreateRole();
			var roleId = $("#role_id").val();
			var barValue ;
			$("input[type='checkbox']").each(function(){
				if($(this).attr("checked") == "checked"){
					barValue = $(this).val();
					createRole_bar(roleId,barValue);
				}
			});
			parent.document.getElementById("right_bot").src="/pages/status.jsp" ;
		});
	});
	function selectcheckbox(dom){
		editAddRoleBar(dom);
		var dom_pa = $(dom).parent().parent();
		if($(dom_pa).hasClass("three")){
			var two_in = $(dom_pa).parent().children(".two").find("input");
			var one_in = $(dom_pa).parent().parent().children(".one").find("input");
			if(!$(two_in).attr("checked")){
				editAddRoleBar($(two_in));
			}
			if(!$(one_in).attr("checked")){
				editAddRoleBar($(one_in));
			}
			
		}else if($(dom_pa).hasClass("two_three")){
			
			var one_in = $(dom_pa).parent().children(".one").find("input");
			if(!$(one_in).attr("checked")){
				editAddRoleBar($(one_in));
			}
		}
		
	}
	function canceledckeckbox(dom){
		editDelRoleBar($(dom));
		$(dom).parent().parent().find("input[type='checkbox']").each(function(){
			if($(this).attr("checked")){
				editDelRoleBar($(this));
			}
		});
	}
	function editAddRoleBar(line_dom){
		var roleId = $("#role_id").val();
		var roleBarVal = $(line_dom).val();
		$.ajax({
			type:"POST",
			data:{"roleId":roleId,"roleBarVal":roleBarVal},
			url:"/barajax/editAddRoleBar",
			dataType:"json",
			success:function(msg){
				var data = eval("("+msg+")");
				if(data.status){
					$(line_dom).attr("checked",true);
				}else{
					$(line_dom).attr("checked",false);
					alert("增加权限失败");
				}
			},
		})
	}
	function editDelRoleBar(line_dom){
		var roleId = $("#role_id").val();
		var roleBarVal = $(line_dom).val();
		$.ajax({
			type:"POST",
			data:{"roleId":roleId,"roleBarVal":roleBarVal},
			url:"/barajax/editDelRoleBar",
			dataType:"json",
			success:function(msg){
				var data = eval("("+msg+")");
				if(data.status){
					$(line_dom).attr("checked",false);
				}else{
					$(line_dom).attr("checked",true);
					alert("删除权限操作失败");
				}
			},
		}) 
	}
	function selectedcheboxs(){
		var roleId = $("#role_id").val();
		$("input[type='checkbox']").each(function(){
			var checkbox = $(this);
			var barStr = $(checkbox).val();
			$.ajax({
				async:false,
				type:"POST",
				url:"/barajax/selectcheckbox",
				data:{"barStr":barStr,"roleId":roleId},
				dataType:"json",
				success:function(msg){
					var data = eval("("+msg+")");
					if(data.status){
						$(checkbox).attr("checked","true");
					}
				},
			});
		});
	}
	function ajaxcreateRole(){
		var roleName = $("#role_name").val();
		if(roleName.length>0){
			$.ajax({
				async:false,
				type:"POST",
				url:"/ajaxcreaterole/c_role.action",
	            data:{"r_name":roleName},
	            dataType:'json',
	            success:function(msg){
	            	var data = eval("("+msg+")");
	            	if(data.status){
						$("#role_id").val(data.roId);
	            	}else{
						alert(data.message);
	            	}
	            },
			});
		}else{
			alert("角色名不能为空");
		}
	}
	function selectOne(two_dom){
		if($(two_dom).children("input").attr("checked")){
			var one = $(two_dom).parent().parent().find(".one");
			if(!$(one).children("input").attr("checked")){
				$(one).children("input").attr("checked","checked");
			}
		}else{
			var two_three = $(two_dom).parent();
			$(two_three).find("input[type='checkbox']").each(function(){
				if($(this).attr("checked")){
					$(this).attr("checked",false);
				}
			});
		}
	}
	function selectTwo(three_input_dom){
		if($(three_input_dom).attr("checked")){
			var two = $(three_input_dom).parent().parent().prev();
			if(!$(two).children("input").attr("checked")){
				$(two).children("input").attr("checked","checked");
				selectOne($(two));
			}
		}
	}
	function createRole_bar(roleId,barValue){
		$.ajax({
			async:false,
			type:"POST",
			url:"/ajaxcreaterole/c_roleBar.action",
            data:{
            	"roleId":roleId,
            	"barValue":barValue,
            },
            dataType:'json',
            success:function(msg){
                
            },
		});
	}
</script>